<template>
    <van-card
      :price="item.price"
      :title="item.title"
      :desc="item.desc"
      :thumb="item.houseImg"

      @click="$router.push(`/detail/${item.houseCode}`)"
    >
      <template #tags>
        <van-tag
            :color="color[Math.floor(Math.random() * color.length)]"
            :text-color="textColor[Math.floor(Math.random() * color.length)]"
            v-for="item,index in item.tags"
            :key="index"
            >{{item}}
        </van-tag>

      </template>
    </van-card>
</template>

<script>
export default {
  name: 'FindItem',
  components: {},
  props: {
    item: {
      type: Object,
      required: true
    }
  },
  data () {
    return {
      color: ['#e1f5f8', '#e1f5ed', '#e6f2ff'],
      textColor: ['#39becd', '#58ca9a', '#5aabfd']
    }
  },
  watch: {},
  computed: {},
  created () {
  },
  mounted () {},
  methods: {
  }
}
</script>
<style lang="less" scoped>
.van-card__thumb {
  flex: 1;
}
/deep/.van-card__thumb img {
  border-radius: 0;
  width: 110px;
  height: 80px;
}
.van-card__content {
  flex: 2;
  >div>div{
    font-size: 16px;
    font-weight: bold !important;
  }
}
.van-card__price {
  color: rgb(255, 60, 0) !important;
}

.van-multi-ellipsis--l2 {
  -webkit-line-clamp: 1;
}
</style>
